<!-- 职位详情 -->
<template>
    <AllOut v-loading="loading">
        <div style="position: relative;">
            <TopNav :show_links="true"></TopNav>
            <div class="content_out index_content" style="padding-top:84px;">
                <b-container fluid>
                    <b-row>
                        <b-col md="3" sm="12" class="">
                            <Asdise :nav_value="3" :companyData="companyData" />
                        </b-col>
                        <b-col md="9" sm="12" class="">
                            <!--  -->
                            <div class="flex jcsb zhiwei_main">
                                <div class="" v-if="loadings">
                                    <p class="">
                                        <span class="zhiwei_title fonts fonts24 fontw700">{{ personData.positionName
                                        }}</span>
                                        <span class="fonts fonts20 red">{{ personData.salaryStart }}-{{ personData.salaryEnd
                                        }}{{ personData.salaryUnit }}
                                            {{ personData.salaryRange }}薪</span>
                                    </p>
                                    <p class="fonts18 fontz gray">
                                        {{ dict(personData.requirementsYears, "requirements_years") }}
                                        | {{ dict(personData.educationRequirements, "education") }}
                                        | {{ dict(personData.positionClassify, "position_classify") }}
                                        | {{ dict(personData.arrivalTime, "arrival_time") }}
                                        <span
                                            v-if="personData.tenantVo.companyName || personData.tenantVo.companyType || personData.tenantVo.companySize || personData.tenantVo.companyIndustry">
                                            | {{ dict(personData.tenantVo.companyType, "company_type") }}
                                            | {{ dict(personData.tenantVo.companyIndustry, "company_industry") }}
                                            | {{ dict(personData.tenantVo.companySize, "company_size") }}
                                        </span>

                                    </p>
                                    <p class="fonts18 fontz gray">招聘人数：{{ personData.recruitmentNumber }}人</p>
                                    <p class="fonts18 fontz gray">更新时间：{{ personData.createTime }}</p>
                                    <p class="fonts18 fontz gray flex aic" v-if="personData.applicationAddress">
                                        <img src="/img/c4.png" alt="" srcset=""
                                            style="width: 16px;height: 18px;margin-right: 6px;" />
                                        {{ personData.applicationAddress }}
                                    </p>
                                    <div class="flex" style="margin-top: 16px;"
                                        v-if="string_arrFun(personData.welfareTreatment).length != 0">
                                        <p class="Information_main_left_btn fontz"
                                            v-for="item in string_arrFun(personData.welfareTreatment)">
                                            {{ dict(item, 'welfare_treatment') }}</p>
                                    </div>
                                </div>
                                <div class=" zhiwei_main_button ">
                                    <div class="flex">
                                        <!-- 应聘报名表 -->
                                        <div v-if="bId">
                                            <el-button class="blue_btn" style="width: 100%;" type="primary"
                                                @click="detail_b()">应聘报名表
                                            </el-button>
                                        </div>
                                        <el-button type="primary" icon="el-icon-star-off"
                                            style="margin-bottom: 16px;margin: 0 16px;" class="flex aic"
                                            @click="collectionApi()" v-if="personData.isCollection == 0">收藏</el-button>
                                        <el-button type="primary" icon="el-icon-star-on"
                                            style="margin-bottom: 16px;margin:0 16px;" class="flex aic"
                                            @click="collectionApi()" v-if="personData.isCollection != 0">取消收藏</el-button>
                                        <!-- 投递简历 -->
                                        <div v-if="indexValue == 0">
                                            <el-button class="blue_btn" style="width: 100%;" type="primary"
                                                @click="deliver()">投递简历
                                            </el-button>
                                        </div>
                                        <!-- 已投递 -->
                                        <div v-if="indexValue == 1">
                                            <el-button link class="blue_btn" type="primary">已投递
                                            </el-button>
                                        </div>
                                        <!-- 已通知笔试-->
                                        <div v-if="indexValue == 2">
                                            <div class="flex">
                                                <el-button type="danger" @click="getup()">放弃笔试</el-button>
                                                <el-button class="blue_btn" type="primary" v-if="indexValue == 2"
                                                    @click="request()">确认参加
                                                </el-button>
                                            </div>
                                        </div>
                                        <!-- 已确认参加笔试 -->
                                        <div v-if="indexValue == 5">
                                            <div class="Information_main_time_gray">
                                                <span class="fontz fonts16" style="color: #2f6cbc;">已确认参加笔试</span>
                                            </div>
                                        </div>
                                        <!-- 面试 -->
                                        <div v-if="indexValue == 8">
                                            <div class="Information_main_time_gray">
                                                <span class="fontz fonts16" style="color: #2f6cbc;">面试</span>
                                            </div>
                                        </div>
                                        <!-- 上传体检报告 -->
                                        <div v-if="indexValue == 3">
                                            <UploadFileT @uploadImageClick="uploadImageClicks_" style="width: 100%;" />
                                        </div>
                                        <el-button type="" style="margin-bottom: 16px;margin-left: 16px;" class="flex aic"
                                            @click="back()">返回</el-button>
                                    </div>
                                    <div class="flex jcfe">
                                        <div class="Information_main_time_gray" v-if="indexValue == 2">
                                            <span class="fontz">通知时间：{{ personData.createTime }}</span>
                                        </div>
                                        <!-- 已放弃笔试 -->
                                        <div class="fonts16" style="color: #fe6470;" v-if="indexValue == 4"> 已放弃笔试</div>
                                        <div class="Information_main_time_gray" v-if="indexValue == 1">
                                            <span class="fontz">投递时间：{{ personData.createTime }}</span>
                                        </div>
                                        <div class="Information_main_time_gray" v-if="indexValue == 5">
                                            <span class="fontz">笔试时间：{{
                                                personData.positionRegistration.writingTestingTime
                                                || "暂无" }}</span>
                                        </div>
                                        <!-- 笔试未通过 -->
                                        <div class="fonts16" style="color: #fe6470;" v-if="indexValue == 6"> 笔试未通过</div>
                                        <!-- 笔试7通过 -->
                                        <div class="fonts16" style="color: #2f6cbc;" v-if="indexValue == 7">笔试通过</div>
                                        <div class="Information_main_time_gray" v-if="indexValue == 8">
                                            <span class="fontz">面试时间：{{ personData.positionRegistration.interviewDate ||
                                                "暂无" }}</span>
                                        </div>
                                        <!-- 背景调查 -->
                                        <div v-if="indexValue == 9">
                                            <div class="Information_main_time_gray">
                                                <span class="fontz fonts16" style="color: #2f6cbc;">背景调查</span>
                                            </div>
                                        </div>
                                        <!-- 录用公示 -->
                                        <div v-if="indexValue == 10">
                                            <div class="Information_main_time_gray">
                                                <span class="fontz fonts16" style="color: #2f6cbc;">录用公示</span>
                                            </div>
                                        </div>
                                        <div v-if="indexValue == 11">
                                            <div class="Information_main_time_gray">
                                                <span class="fontz fonts16" style="color: #2f6cbc;">待入职</span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="zhiwei_main">
                                <p class="">
                                    <span class="zhiwei_title fonts fonts24 fontw700">职位描述</span>
                                </p>
                                <p class="fontz fonts16 color2">
                                    {{ personData.positionDesc }}
                                </p>
                            </div>
                            <div class="zhiwei_main">
                                <p class="">
                                    <span class="zhiwei_title fonts fonts24 fontw700">应聘进度</span>
                                </p>
                                <!-- <div class="flex aic"><span class="fonts16 fontz" style="margin-right: 7px;">当前进度:</span>
                                    <p class="Information_main_left_btn fontz">{{  }}</p>
                                </div>
                                <p class="fonts14 fontz gray" style="margin-top: 10px;">更新时间：2023/08/23 16:38:02:</p>

                                <div class="zhiwei_main_lc">
                                    <p class="zhiwei_main_lc_title"><span class="fontw700 fontz fonts16">[简历初筛]</span><span
                                            class="fontz fonts14 gray" style="margin-left: 32px;">2023/08/23 16:38:02</span>
                                    </p>
                                    <div class="zhiwei_main_lc_main">
                                        <div class="">
                                            <p><span class="fonts14 fontz" style="color: #2F6CBC;">笔试通知</span><span
                                                    class="fonts14 fontz gray" style="margin-left: 30px;">2023/08/23
                                                    16:38:02</span></p>
                                            <p class="fonts12 fontz gray">笔试时间：2023/09/01 10:00</p>
                                            <div class="line"></div>
                                        </div>
                                    </div>
                                </div> -->
                                <ul class="detail_aside_main_ul" v-if="logData.length != 0">
                                    <li class="detail_aside_main_li" v-for="(item, index) in logData" :key="index">
                                        <div class="detail_aside_main_li_t" v-if="item.logSpec == 1"></div>
                                        <div class=" aie" v-if="item.logSpec == 1">
                                            <p class="detail_aside_main_li_title fonts16 fontw500">{{ item.logName }} </p>
                                            <span class=" fonts12 gray magint10">操作时间：{{ item.createTime }}</span>
                                        </div>
                                        <div class="aie" v-if="item.status > 0 && item.logSpec == 2">
                                            <p class="blue fonts14  ">{{ item.logName }}</p>
                                            <span class=" fonts12 gray magint10">操作时间：{{ item.createTime }}</span>
                                        </div>
                                        <div class=" aie" v-if="item.status < 0 && item.logSpec == 2">
                                            <p class="red fonts14 magint10">{{ item.logName }}</p>
                                            <span class=" fonts12 gray magint10">{{ item.createTime }}</span>
                                        </div>
                                        <div class="aie" v-if="item.logSpec == 3">
                                            <p class="fonts14 gray magint10 " v-if="item.content">反馈内容：{{ item.content }}
                                            </p>
                                            <span class=" fonts12 gray magint10">反馈时间：{{ item.createTime }}</span>
                                        </div>
                                        <div class="flex aie" v-if="item.logSpec != 3">
                                            <p class="fonts14 gray magint10 " style="white-space: pre-wrap;"
                                                v-if="item.content">{{ item.content }}</p>
                                        </div>
                                    </li>
                                </ul>
                                <el-empty style="width: 100%;height: 500px;margin: auto;" description="暂无数据应聘进度"
                                    v-if="logData.length == 0" />
                            </div>
                        </b-col>
                    </b-row>
                </b-container>
            </div>
        </div>
    </AllOut>
</template>

<script>
import { dictSect, dictFuns, dictFun } from "@/utils/dictUnit"
import { getInfo } from "@/api/login";
import {
    getposition,
    registrations,
    collections,
    editRegistration,
    registrationLog,
} from "@/api/my.js"
export default {
    data() {
        return {
            indexValue: 0,//0首页1已投递2
            inputValues: "",
            id: "",
            loading: false,
            personData: {
                positionRegistration: {
                    medicalReportIds: ""
                }
            },
            indexValue: "-1",
            loadings: false,
            companyData: {
                tenantVo: {},
                tenantId: ""
            },
            logData: [
                // {
                //     content:null,
                //     createTime:"2023-11-29 10:16:15",
                //     id:"1729685670905589761",
                //     logName:"【初筛】",
                //     logSpec:1,
                //     logType:1,
                //     positionRegistrationId:"1729685670838480897",
                //     status: 0,
                //     updateStatus: 1,
                // }
            ],
            bId: "",//报名表id
            reportIdEdit: "",
        }
    },
    mounted() {
        // this.indexValue = this.getUrlParams().indexValue
        this.id = this.getUrlParams().id
        console.log("刷新");
        this.getpositionApi(this.id)

    },
    methods: {
        back(){
            history.back()
        },
        //----------------------------------------------------- 获取地址栏参数---------------------------------
        getUrlParams() {
            let url = window.location.search; //获取url中"?"符后的字串
            let paramsObj = new Object();
            if (url.indexOf("?") != -1) {
                let str = url.substr(1);
                str = str.split("&");
                for (let i = 0; i < str.length; i++) {

                    paramsObj[str[i].split("=")[0]] = decodeURI(str[i].split("=")[1]);

                }
            }
            return paramsObj;
        },
        //----------------------------------------------------- 字典--------------------------------- 
        dict(value, res) {
            return dictFuns(value, res)
        },
        string_arrFun(res) {
            // console.log(res);
            let arrs = res ? res.split(",") : []
            return arrs
        },
        //----------------------------------------------------- 获取详情---------------------------------
        editRegistrationApi(params) {
            editRegistration(params).then(res => {
                this.getpositionApi(this.id)
                this.$message({
                    message: `${res.msg}`,
                    type: 'success',
                });
            }).catch(res => {
                this.$message({
                    message: `${res.msg}`,
                    type: 'error',
                });
            })
        },
        // 获取
        async getpositionApi(params) {
            this.loading = true
            this.loadings = false
            await getposition(params).then((res) => {
                this.loading = false
                this.loadings = true
                console.log("个人信息：", res);
                this.personData = res.data
                this.bId = this.personData.registrationFormTemplateId
                this.reportIds = this.personData?.positionRegistration?.registrationFromId
                this.reportIdEdit = this.personData?.positionRegistration?.id
                this.registrationLogApi()
                this.companyData.tenantVo = this.personData.tenantVo
                this.companyData.tenantId = this.personData.tenantId
                if (this.personData.positionRegistration == null) {
                    this.indexValue = 0 //投递简历
                } else {
                    if (this.personData.positionRegistration.writingTestingStatus == 0) {
                        this.indexValue = 1 //已投递简历
                    } else if (this.personData.positionRegistration.writingTestingStatus == 1) {
                        this.indexValue = 2 //是否放弃笔试
                    } else if (this.personData.positionRegistration.writingTestingStatus == "-1") {
                        this.indexValue = 4 //已放弃笔试
                    } else if (this.personData.positionRegistration.writingTestingStatus == 2) {
                        this.indexValue = 5 //已确定笔试
                        if (this.personData.positionRegistration.writingTestingResult == 0) {
                            this.indexValue = 6 //笔试未通过
                        } else if (this.personData.positionRegistration.writingTestingResult == 1) {
                            this.indexValue = 7 //笔试通过
                        }
                    }
                    if (this.personData.positionRegistration.status == 4) {
                        this.indexValue = 8 //开始面试
                    } else if (this.personData.positionRegistration.status == 5) {

                        this.indexValue = 9//背景调查
                    } else if (this.personData.positionRegistration.status == 6) {
                        this.indexValue = 3 //上传体检报告
                    } else if (this.personData.positionRegistration.status == 7) {
                        this.indexValue = 10//录用公示
                    } else if (this.personData.positionRegistration.status == 8) {
                        this.indexValue = 11//待入职
                    }
                    // if(true){
                    // 	this.indexValue = 3 //
                    // }
                }


            })
        },
        getup() {
            this.$confirm('确定是否放弃笔试？', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                let params = {
                    id: this.personData.positionRegistration.id,
                    writingTestingStatus: "-1"
                }
                this.editRegistrationApi(params)
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消操作'
                });
            });

        },
        request() {
            let params = {
                id: this.personData.positionRegistration.id,
                writingTestingStatus: 2
            }
            this.editRegistrationApi(params)
        },
        deliver() { //投递简历
            registrations({
                positionId: this.id
            }).then(res => {
                this.$message({
                    message: `${res.msg}`,
                    type: 'success',
                });
                this.getpositionApi(this.id)
            }).catch(res => {
                this.$message({
                    message: `${res.msg}`,
                    type: 'error',
                });
            })
        },
        collectionApi() { //收藏职位
            collections({
                positionId: this.id
            }).then(res => {
                this.$message({
                    message: `${res.msg}`,
                    type: 'success'
                });
                this.getInfo_()
                this.getpositionApi(this.id)
            }).catch(res => {
                this.$message({
                    message: `${res.msg}`,
                    type: 'error'
                });
            })
        },
        async registrationLogApi() {
            await registrationLog({ positionRegistrationId: this.personData.positionRegistration.id }).then(res => {
                console.log("投递日志", res);
                this.logData = res.data
            })
        },
        getInfo_() {
            this.refush = !this.refush
            getInfo().then(res => {
                console.log("个人信息", res);
                sessionStorage.setItem("myInfornation", JSON.stringify(res.data))
            })
        },
        uploadImageClicks_(value) {
            console.log(value);
            let obj = {
                medicalReportIds: this.personData.positionRegistration.medicalReportIds,
                id: this.personData.positionRegistration.id
            }
            obj.medicalReportIds = obj.medicalReportIds ? obj.medicalReportIds + "," + value : value
            console.log(obj);
            this.editRegistrationApi(obj)
        },
        detail_b() {//去往应聘报名表
            this.$router.push(`zhiwei_reusme?id=${this.bId}&ids=${this.id}&reportIds=${this.reportIds}&reportIdEdit=${this.reportIdEdit}&type=${this.indexValue}`)
        }
    }
}
</script>

<style lang="scss" scoped>
.Information_main_time_gray {
    margin-top: 16px;
    font-size: 16px;
    color: #898989;
}

.Information_main_time_red {
    margin-top: 16px;
    font-size: 16px;
    color: #FE6470;
}

.detail_aside_main_ul {
    padding-left: 24px;
    list-style: none;

    .detail_aside_main_li {
        // margin-bottom: 26px;
        padding: 14px 12px;
        // background: #F4F4F4;
        border-radius: 0px 0px 0px 0px;
        opacity: 1;
        position: relative;

        .detail_aside_main_li_t {
            left: -32px;
            position: absolute;
            content: "";
            top: 15px;
            width: 16px;
            height: 16px;
            opacity: 1;
            border: 1px solid #2F6CBC;
            border-radius: 50%;

            &::after {
                content: "";
                top: 4px;
                left: 4px;
                position: absolute;
                width: 8px;
                height: 8px;
                background: #2F6CBC;
                opacity: 1;
                border-radius: 50%;

            }
        }


        &:last-child {

            // margin-left: 24px;
            &::before {
                display: none;
            }
        }

        &::before {
            position: absolute;
            content: "";
            top: 7.5px;
            height: calc(100% + 22px);
            left: -24px;
            top: 32px;
            opacity: 1;
            border: 1px dashed #EAE8F2;

        }

        .detail_aside_main_li_title {}
    }
}

.line {
    border: 1px solid #D8D8D8;
}

.zhiwei_main_lc_main {
    padding: 12px;
    background: #F8F9FA;
    border-radius: 0px 0px 0px 0px;
    opacity: 1;
}

.zhiwei_main_lc {
    padding: 20px 32px;

    .zhiwei_main_lc_title {
        position: relative;

        &::after {
            position: absolute;
            content: "";
            top: 5px;
            left: -32px;
            width: 16px;
            height: 16px;
            border-radius: 50%;

            opacity: 1;
            border: 1px solid #2F6CBC;


        }

        &::before {
            content: "";
            position: absolute;
            top: 9px;
            left: -28px;
            width: 8px;
            height: 8px;
            background: #2F6CBC;
            opacity: 1;
            border-radius: 50%;
        }
    }

}

.Information_main_left_btn {
    margin: 0;
    margin-right: 16px;
    margin-bottom: 16px;
    padding: 0px 14px;
    line-height: 30px;
    background: #EFF3F7;
    border-radius: 15px 15px 15px 15px;
    opacity: 1;
    font-size: 18px;
    font-weight: 400;
    color: #2F6CBC;
}

.zhiwei_main {
    padding: 25px;
    background: #FFFFFF;
    border-radius: 0px 0px 0px 0px;
    opacity: 1;
    border: 1px solid #CACFD6;
    margin-bottom: 11px;
}

.zhiwei_main_button {
    .el-button {
        height: 40px;
    }
}

.zhiwei_title {
    position: relative;

    &::after {
        position: absolute;
        left: -25px;
        top: 10px;
        content: "";
        width: 4px;
        height: 16px;
        background: #2F6CBC;
        border-radius: 0px 2px 2px 0px;
        opacity: 1;
    }
}

.red {
    color: #B60000;
}

.gray {
    color: #898989;
}
</style>